home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2006 May / PCWMAY06.iso / Software / Freeware / First Page 2006 3.00 / fp2006-final-3.00-setup.exe / {app} / Iscripts / DHTML - Scrollers / expandable-ticker.izs < prev    next >
Text File  |  2005-09-02  |  9KB  |  232 lines
  1. <!NOWIZARD>
  2.  
  3. <!TITLE>Expandable ticker
  4. <!/TITLE>
  5.  
  6. <!BROWSER>FF1+ IE5+ Opr7+<!/BROWSER>
  7.  
  8. <!DESCRIPTION> This script expands on the regular ticker, by delivering its messages both in sequence (one at a time), and optionally, all at once. No more waiting to get to a message you saw earlier! Script works in IE4+, NS4, and NS6+.
  9. <!/DESCRIPTION> 
  10.  
  11. <!CATEGORY>scrollers<!/CATEGORY>
  12.  
  13. <!SCRIPT>
  14. <!-- START OF SCRIPT -->
  15. <!-- Step 1: Copy the below style sheet into the HEAD section of your page: -->
  16. <style>
  17. <!--
  18.  
  19. #listbutton{
  20. border:1px solid #4B4B4B;
  21. background-color:#F3F3F3;
  22. width:50px;
  23. height:12px;
  24. font: normal 11px Arial;
  25. text-align:center;
  26. cursor:pointer;cursor:hand;
  27. }
  28.  
  29. .expandhighlight, .expandhighlight a{
  30. color:red;
  31. }
  32.  
  33. -->
  34. </style>
  35. <!-- Step 2: Then, put the below script where you wish the ticker to appear in the BODY section of your page: -->
  36. <script language="JavaScript1.2">
  37.  
  38. //Expandable ticker script- By Dynamic Drive
  39. //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
  40. //This credit MUST stay intact for use
  41.  
  42. //configure tickercontents[] to set the messges you wish be displayed (HTML codes accepted)
  43. var tickercontents=new Array()
  44. tickercontents[0]='See what\'s New at Dynamic Drive. <a href="http://www.dynamicdrive.com/new.htm">[Read more]</a>'
  45. tickercontents[1]='Browse the most popular scripts on Dynamic Drive <a href="http://www.dynamicdrive.com/hot.htm">[Read more]</a>'
  46. tickercontents[2]='<a href="http://www.dynamicdrive.com/link.htm">Link back to Dynamic Drive!</a>'
  47.  
  48. //configure the below 2 variables to set the width/background color of the ticker
  49. var tickerwidth='475px'
  50. var tickerbgcolor='#DDDDFF'
  51.  
  52. //configure the below variable to determine the delay between ticking of messages (in miliseconds)
  53. var tickdelay=3000
  54.  
  55. ////Do not edit pass this line////////////////
  56.  
  57. var ie4=document.all
  58. var ns6=document.getElementById
  59. var ns4=document.layers
  60.  
  61. var currentmessage=0
  62. var tickercontentstotal=''
  63.  
  64. function changetickercontent(){
  65. if (ns4){
  66. tickerobj.document.tickernssub.document.write('<b><a href="#" onClick="return expandlist(event)">Expand</a></b> | '+tickercontents[currentmessage])
  67. tickerobj.document.tickernssub.document.close()
  68. }
  69. else if (ie4||ns6){
  70. tickerobj.innerHTML=tickercontents[currentmessage]
  71. previousmessage=(currentmessage==0)? tickercontents.length-1 : currentmessage-1
  72. tickerexpand_item=ns6? document.getElementById("expand"+currentmessage) : eval("expand"+currentmessage)
  73. tickerexpand_previousitem=ns6? document.getElementById("expand"+previousmessage) : eval("expand"+previousmessage)
  74. tickerexpand_previousitem.className=""
  75. tickerexpand_item.className="expandhighlight"
  76. }
  77.  
  78. currentmessage=(currentmessage==tickercontents.length-1)? 0 : currentmessage+1
  79. setTimeout("changetickercontent()",tickdelay)
  80. }
  81.  
  82. function start_ticking(){
  83. if (ns4) document.tickernsmain.visibility="show"
  84. tickerobj=ie4? tickerlist : ns6? document.getElementById("tickerlist") : ns4? document.tickernsmain : ""
  85. tickerexpandobj=ie4? tickerexpand : ns6? document.getElementById("tickerexpand") : ns4? document.expandlayer : ""
  86.  
  87. for (i=0;i<tickercontents.length;i++) //get total scroller contents
  88. tickercontentstotal+='<div id="expand'+i+'">- '+tickercontents[i]+'</div>'
  89. if (ie4||ns6)
  90. tickerexpandobj.innerHTML=tickercontentstotal
  91. else{
  92. tickerexpandobj.document.write(tickercontentstotal)
  93. tickerexpandobj.document.close()
  94. }
  95. changetickercontent()
  96. }
  97.  
  98. function expandlist(e){
  99. if (ie4||ns6){
  100. tickerexpand_parent=ie4? tickerexpand.parentElement : document.getElementById("tickerexpand").parentNode
  101. tickerexpand_parent.style.display=(tickerexpand_parent.style.display=="none")? "" : "none"
  102. }
  103. else{
  104. document.expandlayer.left=e.pageX-e.layerX
  105. document.expandlayer.top= e.pageY-e.layerY+20
  106. document.expandlayer.visibility=(document.expandlayer.visibility=="hide")? "show" : "hide"
  107. return false
  108. }
  109. }
  110.  
  111. if (ie4||ns6)
  112. document.write('<table border="0" style="width:'+tickerwidth+';border:1px solid black;text-indent:2px" bgcolor="'+tickerbgcolor+'" cellspacing="0" cellpadding="0"><tr><td width="90%" id="tickerlist" bgcolor="'+tickerbgcolor+'"></td><td width="10%" bgcolor="'+tickerbgcolor+'"><div id="listbutton" onClick="expandlist()">Expand</div></td></tr><tr style="display:none"><td id="tickerexpand" width="90%" bgcolor="'+tickerbgcolor+'"> </td><td width="10%"></td></tr></table>')
  113.  
  114. window.onload=start_ticking
  115. </script>
  116.  
  117. <ilayer id="tickernsmain" width=&{tickerwidth}; bgColor=&{tickerbgcolor}; visibility=hide><layer id="tickernssub" width=&{tickerwidth}; left=0 top=0></layer></ilayer>
  118. <layer id="expandlayer" bgColor=&{tickerbgcolor}; visibility=hide></layer>
  119. <!-- END OF SCRIPT -->
  120. <!/SCRIPT>
  121.  
  122. <!PREVIEW>
  123. <!-- START OF SCRIPT -->
  124. <!-- Step 1: Copy the below style sheet into the HEAD section of your page: -->
  125. <style>
  126. <!--
  127.  
  128. #listbutton{
  129. border:1px solid #4B4B4B;
  130. background-color:#F3F3F3;
  131. width:50px;
  132. height:12px;
  133. font: normal 11px Arial;
  134. text-align:center;
  135. cursor:pointer;cursor:hand;
  136. }
  137.  
  138. .expandhighlight, .expandhighlight a{
  139. color:red;
  140. }
  141.  
  142. -->
  143. </style>
  144. <!-- Step 2: Then, put the below script where you wish the ticker to appear in the BODY section of your page: -->
  145. <script language="JavaScript1.2">
  146.  
  147. //Expandable ticker script- By Dynamic Drive
  148. //For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
  149. //This credit MUST stay intact for use
  150.  
  151. //configure tickercontents[] to set the messges you wish be displayed (HTML codes accepted)
  152. var tickercontents=new Array()
  153. tickercontents[0]='See what\'s New at Dynamic Drive. <a href="http://www.dynamicdrive.com/new.htm">[Read more]</a>'
  154. tickercontents[1]='Browse the most popular scripts on Dynamic Drive <a href="http://www.dynamicdrive.com/hot.htm">[Read more]</a>'
  155. tickercontents[2]='<a href="http://www.dynamicdrive.com/link.htm">Link back to Dynamic Drive!</a>'
  156.  
  157. //configure the below 2 variables to set the width/background color of the ticker
  158. var tickerwidth='475px'
  159. var tickerbgcolor='#DDDDFF'
  160.  
  161. //configure the below variable to determine the delay between ticking of messages (in miliseconds)
  162. var tickdelay=3000
  163.  
  164. ////Do not edit pass this line////////////////
  165.  
  166. var ie4=document.all
  167. var ns6=document.getElementById
  168. var ns4=document.layers
  169.  
  170. var currentmessage=0
  171. var tickercontentstotal=''
  172.  
  173. function changetickercontent(){
  174. if (ns4){
  175. tickerobj.document.tickernssub.document.write('<b><a href="#" onClick="return expandlist(event)">Expand</a></b> | '+tickercontents[currentmessage])
  176. tickerobj.document.tickernssub.document.close()
  177. }
  178. else if (ie4||ns6){
  179. tickerobj.innerHTML=tickercontents[currentmessage]
  180. previousmessage=(currentmessage==0)? tickercontents.length-1 : currentmessage-1
  181. tickerexpand_item=ns6? document.getElementById("expand"+currentmessage) : eval("expand"+currentmessage)
  182. tickerexpand_previousitem=ns6? document.getElementById("expand"+previousmessage) : eval("expand"+previousmessage)
  183. tickerexpand_previousitem.className=""
  184. tickerexpand_item.className="expandhighlight"
  185. }
  186.  
  187. currentmessage=(currentmessage==tickercontents.length-1)? 0 : currentmessage+1
  188. setTimeout("changetickercontent()",tickdelay)
  189. }
  190.  
  191. function start_ticking(){
  192. if (ns4) document.tickernsmain.visibility="show"
  193. tickerobj=ie4? tickerlist : ns6? document.getElementById("tickerlist") : ns4? document.tickernsmain : ""
  194. tickerexpandobj=ie4? tickerexpand : ns6? document.getElementById("tickerexpand") : ns4? document.expandlayer : ""
  195.  
  196. for (i=0;i<tickercontents.length;i++) //get total scroller contents
  197. tickercontentstotal+='<div id="expand'+i+'">- '+tickercontents[i]+'</div>'
  198. if (ie4||ns6)
  199. tickerexpandobj.innerHTML=tickercontentstotal
  200. else{
  201. tickerexpandobj.document.write(tickercontentstotal)
  202. tickerexpandobj.document.close()
  203. }
  204. changetickercontent()
  205. }
  206.  
  207. function expandlist(e){
  208. if (ie4||ns6){
  209. tickerexpand_parent=ie4? tickerexpand.parentElement : document.getElementById("tickerexpand").parentNode
  210. tickerexpand_parent.style.display=(tickerexpand_parent.style.display=="none")? "" : "none"
  211. }
  212. else{
  213. document.expandlayer.left=e.pageX-e.layerX
  214. document.expandlayer.top= e.pageY-e.layerY+20
  215. document.expandlayer.visibility=(document.expandlayer.visibility=="hide")? "show" : "hide"
  216. return false
  217. }
  218. }
  219.  
  220. if (ie4||ns6)
  221. document.write('<table border="0" style="width:'+tickerwidth+';border:1px solid black;text-indent:2px" bgcolor="'+tickerbgcolor+'" cellspacing="0" cellpadding="0"><tr><td width="90%" id="tickerlist" bgcolor="'+tickerbgcolor+'"></td><td width="10%" bgcolor="'+tickerbgcolor+'"><div id="listbutton" onClick="expandlist()">Expand</div></td></tr><tr style="display:none"><td id="tickerexpand" width="90%" bgcolor="'+tickerbgcolor+'"> </td><td width="10%"></td></tr></table>')
  222.  
  223. window.onload=start_ticking
  224. </script>
  225.  
  226. <ilayer id="tickernsmain" width=&{tickerwidth}; bgColor=&{tickerbgcolor}; visibility=hide><layer id="tickernssub" width=&{tickerwidth}; left=0 top=0></layer></ilayer>
  227. <layer id="expandlayer" bgColor=&{tickerbgcolor}; visibility=hide></layer>
  228.  
  229. <!-- END OF SCRIPT -->
  230. <!/PREVIEW>
  231.  
  232. <!RELATED>NONE<!/RELATED>